﻿<%@ Page Title="" Language="C#" MasterPageFile="~/ext.Master" AutoEventWireup="true" CodeBehind="Ext.Grid.aspx.cs" Inherits="Demo.Grid.Ext_Grid" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <script type="text/javascript" src="/extjs/ux/data/PagingMemoryProxy.js"></script>
    <script type="text/javascript">
        Ext.onReady(function () {
            Ext.QuickTips.init();
            Ext.Ajax.request({
                //加载servlet输出
                url: "/common/GetPageData.ashx",
                //url:"../PrintGridInfoTwo",
                success: function (response, config) {
                    //对后台输出的Json进行解码
                    json = Ext.decode(response.responseText);
                    //这里需要从后台动态加载
                    //这里的json.columnModel是从后台加载来的
                    //var cm = new Ext.grid.ColumnModel(json.columnModel);

                    var store = Ext.create('Ext.data.Store', {
                        fields: ['物料ID', '物料编码', '物料名称', '物料分类ID'],
                        pageSize: 5,
                        proxy: new Ext.data.PagingMemoryProxy(json.Data),
                        data: json.Data
                    });

                    var grid =   Ext.create('Ext.grid.Panel', {
                        renderTo: 'dynamicGrid',
                        height: 300,
                        width: 400,
                        store: store,
                        columns: [
                            {
                                text: '物料编码',
                                flex: 1,
                                sortable: false,
                                dataIndex: '物料编码'
                            },
                            {
                                text: '物料名称',
                                flex: 1,
                                sortable: false,
                                dataIndex: '物料名称'
                            }
                        ],
                        viewConfig: {
                            stripeRows: true,
                            enableTextSelection: true
                        },
                        bbar: {
                            xtype: 'pagingtoolbar',
                            dock: 'bottom',
                            
                            store: store
                        }
                    });
                    store.load();
                },
                failure: function () {
                    alert("error");
                }
            });
        });


    </script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <div id="dynamicGrid"></div>
</asp:Content>
